<script>
import {addHelp} from "@/api/project/help";

export default {
  name: "add-help",
  data() {
    return {
      rules: {
        title: [{required: true, message: "请输入标题", trigger: "blur"}],
        content: [{required: true, message: "请输入内容", trigger: "blur"}],
        solved: [{required: true, message: "请选择是否解决", trigger: "blur"}],
        img: [{required: true, message: "请上传图片", trigger: "blur"}]
      },
      form: {
        solved: '未解决'
      },
    }
  },
  methods: {
    reset() {
      this.form = {
        solved: '未解决'
      }
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          addHelp(this.form).then(res => {
            this.$modal.msgSuccess("发布成功");
            this.reset()
          })
        }
      });
    },
  }
}
</script>

<template>
  <div>
    <el-card style="margin: 20px 20%;">
      <div slot="header" class="clearfix">
        <div style="font: bolder 20px normal;text-align:center">
          发布求购
        </div>
      </div>
      <el-form ref="form" :model="form" :rules="rules" label-width="auto">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="标题" prop="title">
              <el-input v-model="form.title" placeholder="请输入标题"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否已解决" prop="solved">
              <el-select v-model="form.solved" placeholder="请选择是否解决" style="width: 100%;">
                <el-option label="已解决" value="已解决"/>
                <el-option label="未解决" value="未解决"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="图片" prop="img">
              <image-upload v-model="form.img" :limit="1"/>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="内容" prop="content">
              <el-input type="textarea" :rows="3" v-model="form.content"/>
            </el-form-item>
          </el-col>
        </el-row>
        <div style="display: flex;justify-content: right;margin: 20px" class="form-footer">
          <el-button type="primary" @click="submitForm">提交</el-button>
          <el-button @click="reset">重置</el-button>
        </div>
      </el-form>

    </el-card>

  </div>
</template>

<style scoped>

</style>

